﻿<%@page contentType="text/html;charset=UTF-8"   language="java"  %>
<%
	String base = request.getContextPath();
%>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>Market Place</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<jsp:include page="/pages/common/include.jsp" flush="true"/>
		<link rel="stylesheet" href="<%=base%>/resources/css/confirmorder.css" />


	</head>

	<body>
		
		<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">
			<!--侧滑菜单部分-->
			<aside id="offCanvasSide" class="mui-off-canvas-left">
				<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<jsp:include page="/pages/common/menu.jsp" flush="true" />
					</div>
				</div>
			</aside>
			<!--主界面部分-->
			<div class="mui-inner-wrap">
				<header class="mui-bar mui-bar-nav" id="headBox">
					<jsp:include page="/pages/common/top.jsp" flush="true" />
				</header>
				<header class="mui-bar mui-bar-nav GreenHeader">
					<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
				    <h1 class="mui-title">Order Summary</h1>
				</header>
				<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper noHead">
					<div class="mui-scroll">
						<div class="confirmOrder">
							<div class="stepBox">
								<div class="step">Delivery&nbsp;&&nbsp;Payment</div>
								<div class="step active">Summary</div>
								<div class="step">Complete</div>
							</div>
						    <div class="orderBox DrinksBeverages">
						    	<h4>Delivery and Payment Details 
						    		<!--<span class="mui-pull-right"><img src="<%=base%>/resources/images/icon/edit.png" />Edit</span>-->
						    	</h4>
						    	<div class="info">
						    		<p>Name:<span class="mui-pull-right"></span></p>
						    		<p>Delivery address:<span class="mui-pull-right"></span></p>
						    		<p>Contact Number:<span class="mui-pull-right"></span></p>
						    		<p>Call before delivery: <span class="mui-pull-right"></span></p>
						    		<p>Special Rrequest:<span class="mui-pull-right"></span></p>
						    		<p>Delivery Slot: <span class="mui-pull-right"></span></p>
						    		<p>Payment Method:<span class="mui-pull-right"></span></p>
						    		<p>E-invoice:<span class="mui-pull-right"></span></p>
						    		<p>Octopus Number:<span class="mui-pull-right"></span></p>
						    	</div>
						    </div>
						    <div class="orderBox OrderDetail">
						    	<h4>Order Details</h4>
						    	<div class="totalItem">
						    		Item Details <span class="mui-pull-right">Amount</span>
						    	</div>
						    	<div class="info detailinfo">
						    	</div>
						    	<div class="totalPrice">
						    		Sub Total:(<em>2</em> items)  <span>$52.20</span>
						    	</div>
						    	<div class="descriBox">
						    		Don’t miss out! To enjoy offer  such as “Buy 1  Get 1 Free”,“Buy 2 Get 1 Free” or “Buy any product to get another free gift ”, please make sure you add the free item of the relevant promotion into your shopping cart.Promotion freebies will not be delivered unless they have been added to your cart. 
						    	</div>
						    	<div class="Offers">
							    	<div class="title">Offers</div>
							    	<div class="content">
							    		<p>
							    			<span class="mui-pull-left">BUY 3 PACKS OF VITA LEMON/CHRYS TEA 6X250ML FREE A PACK OF MALTED SOYA MILK 6X250ML </span>
							    			<span class="mui-pull-right">-$10.01</span>
							    		</p>
							    		<p>
							    			<span class="mui-pull-left">FREE DELIVERY E-COUPON</span>
							    			<span class="mui-pull-right">-$10.01</span>
							    		</p>
							    	</div>
							    	 <div class="check">
								    	<p>Saving:<span class="mui-pull-right">-$17.90</span></p>
								    	<p>Delivery Fee:<span class="mui-pull-right">$0.00</span></p>
								    	<p>Bank Discount:<span class="mui-pull-right">$0.00</span></p>
								    	<p>Net Purchase:<span class="mui-pull-right">$20.00</span></p>
								    	<div class="descri">(Enjoy free delivery for net purchases over $500)</div>
								    </div>
								    <div class="totalPrice">
								    	Sub Total:(<em>2</em> items)  <span>$52.20</span>
								    </div>
								    <div class="danger">Your delivery will ONLY include items which have been placed in your shopping cart. Promotional freebies will not be delivered unless they have been added to your cart.</div>
							    </div>
						    </div>
						    
						  	<div class="confirmBtn summaryBox" style="font-weight: bold">
						   		<div><a href="javascript:void(0)" class="mui-btn mui-action-back">Back</a></div>
						   		<div><a href="javascript:void(0)" class="mui-btn">Confirm Order</a></div>
						   </div>
						   <div class="footer" id="footer">
							   <jsp:include page="/pages/common/footer.jsp" flush="true" />
						   </div>
						</div>
					</div>
				</div>
				<!--searchbar-->
				<div class="searchBar">
					<jsp:include page="/pages/common/search.jsp" flush="true" />
				</div>
				
				<div class="rightBottom animate"></div>
			</div>

		<script type="text/javascript" src="<%=base%>/resources/js/confirm/confirm-summary.js" ></script>
		 <script>
		
			//主界面和侧滑菜单界面均支持区域滚动；
			mui('#offCanvasSideScroll').scroll();
			mui('#offCanvasContentScroll').scroll();
		</script>
	</body>

</html>